<template>
  <div class="order-logs">
    <el-timeline v-loading="loading" :reverse="false">
      <el-timeline-item
        v-for="(log, index) in logs"
        :key="index"
        :timestamp="log.createTime"
        :hide-timestamp="true"
      >
        <el-popover
          v-model="log.visible"
          placement="right"
          width="500"
          trigger="hover"
        >
          <p v-html="log.message" />
          <el-button slot="reference" type="text">{{ log.info }}</el-button>
        </el-popover>
      </el-timeline-item>
    </el-timeline>
  </div>
</template>
<script>
export default {
  name: 'Logs',
  props: {
    path: {
      type: String,
      default: '/api/pur/order-info/log/'
    }
  },
  data() {
    return {
      logs: [],
      loading: false
    }
  },
  created() {
    // this.init()
  },
  methods: {
    load(orderId) {
      const that = this
      const url = that.$http.conf.api.get('wms').url + that.path + orderId
      that.$http.get(url).then((res) => {
        if (res.code !== 200) {
          that.$message.error(res.message)
          return
        }
        that.logs = res.data
        that.$emit('call', that.logs)
      })
        .catch(e => {
          console.error(e)
          that.$message.error('获取异常')
        })
    }
  }
}
</script>
<style scoped>
.order-logs{
  padding-top: 20px;
  position: absolute;
                z-index: 1;
                width:100%;
                font-size: 12px;
                overflow-y: auto;
                height: 230px;
}
</style>
